<nz-spin [nzSpinning]="isLoading">
  <nz-descriptions nzSize="small" nzBordered [nzColumn]="1" *ngIf="user">
    <nz-descriptions-item nzTitle="Product">{{ user.product }}</nz-descriptions-item>
    <nz-descriptions-item nzTitle="Billing Mode">{{ user.billingMode }}</nz-descriptions-item>
    <nz-descriptions-item nzTitle="Automatic Renewal">{{ user.automaticRenewal }}</nz-descriptions-item>
    <nz-descriptions-item nzTitle="Order Time">{{ user.orderTime | date }}</nz-descriptions-item>
    <nz-descriptions-item nzTitle="Usage Time" [nzSpan]="2"> {{ user.usageTime }} </nz-descriptions-item>
    <nz-descriptions-item nzTitle="Status" [nzSpan]="3">
      <nz-badge nzStatus="processing" [nzText]="user.status"></nz-badge>
    </nz-descriptions-item>
    <nz-descriptions-item nzTitle="Negotiated Amount">{{ user.negotiatedAmount | currency }}</nz-descriptions-item>
    <nz-descriptions-item nzTitle="Discount">{{ user.discount | currency }}</nz-descriptions-item>
    <nz-descriptions-item nzTitle="Official Receipts">{{ user.officialReceipts | currency }}</nz-descriptions-item>
    <nz-descriptions-item nzTitle="Config Info"><span [innerText]="user.configInfo"></span></nz-descriptions-item>
  </nz-descriptions>
</nz-spin>
